import { addHospitalSet, getHospitalSetById, updateHospitalSet } from '@/api/hospital/hospitalSet'
import { Button, Card, Form, Input, message, Space } from 'antd'
import React, { useCallback, useEffect } from 'react'
import { useNavigate, useParams } from 'react-router-dom'

export default function AddOrUpdateHospitalSet() {
    const navigate = useNavigate()
    const [form] = Form.useForm()
    // 获取path参数id
    let { id } = useParams()
    const onFinish = useCallback(async () => {
        // 1. 获取表单数据
        let data = form.getFieldsValue()
        try {
            if (id) {
                await updateHospitalSet({
                    ...data,
                    id
                })
                message.success('编辑成功')
            } else {
                // 2. 调用api函数 发送ajax请求
                // 3. 跳转到医院设置列表页
                await addHospitalSet(data)
                message.success('添加成功')
            }
            navigate('/syt/hospital/hospitalSet')
        } catch (e: any) {
            message.error(e.message)
        }

    }, [])
    const _getHospitalSetById = async () => {
        let fields = await getHospitalSetById(id as string)
        console.log('res: ', fields)
        // 设置表单数据
        form.setFieldsValue(fields)
    }
    useEffect(() => {
        id && _getHospitalSetById()
    }, [])
    return (
        <Card>
            <Form
                name="basic"
                labelCol={{ span: 3 }}
                wrapperCol={{ span: 21 }}
                onFinish={onFinish}
                form={form}
            >
                <Form.Item
                    label="医院名称"
                    name="hosname"
                    rules={[{ required: true, message: '请输入医院名称!' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="医院编号"
                    name="hoscode"
                    rules={[{ required: true, message: '请输入医院编号!' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="api基础路径"
                    name="apiUrl"
                    rules={[{ required: true, message: '请输入api基础路径!' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="联系人姓名"
                    name="contactsName"
                    rules={[{ required: true, message: '请输入联系人姓名!' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item
                    label="联系人手机号"
                    name="contactsPhone"
                    rules={[{ required: true, message: '请输入联系人手机号!' }]}
                >
                    <Input />
                </Form.Item>

                <Form.Item wrapperCol={{ offset: 3, span: 16 }}>
                    <Space>
                        <Button type="primary" htmlType="submit">
                            保存
                        </Button>
                        <Button>返回</Button>
                    </Space>

                </Form.Item>
            </Form>
        </Card>
    )
}
